<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:include="include/head::commonHeaderCustomEdit('学员信息卡',~{::style})">
    <style>
        .box-left {
            display: table-cell;
            width: 250px;
            /*height:100%;*/
        }

        .box-left > :first-child {
            height: calc(100vh - 60px);
            overflow-y: auto;
        }

        .box-left ul {
            padding-left: 10px;
            border-right: solid 1px #DFDFDF;
        }

        .box-left ul li {
            border-bottom: solid 1px #DFDFDF;
            padding-top: 10px;
            list-style: none;
        }

        .box-left ul li div {
            display: table-cell;
        }

        .box-left ul li div:first-child {
            width: 82px;
            padding-left: 10px;
            font-weight: bold;
        }

        .box-right {
            /*height:100%;*/
            display: table-cell;
            padding-left: 15px;
        }

        .box-right > :first-child {
            /*height:100%;*/
            height: calc(100vh - 100px);
            overflow: auto;
        }
        @media screen and (max-width: 1300px) {
            .box-left > :first-child {height: calc(100vh - 104px);}
            .box-right > :first-child {height: calc(100vh - 98px);}
        }
        @media screen and (max-width: 1600px) {
            .box-left > :first-child {height: calc(100vh - 104px);}
            .box-right > :first-child {height: calc(100vh - 98px);}
        }
        @media screen and (max-width: 1900px) {
            .box-left > :first-child {height: calc(100vh - 60px);}
            .box-right > :first-child {height: calc(100vh - 56px);}
        }
        .box-right table caption {
            padding-top: 8px;
            padding-bottom: 2px;
            padding-left: 2px;
            color: #000000;
            text-align: left;
            font-size: 17px;
            font-weight: bold;
        }

        .pager-sm a {
            padding: 0px 10px;
            border-radius: 5px;
        }

        .nav-tabs > li.active > a {
            font-weight: bold;
        }

        #iframe {
            height: calc(100vh - 56px);
            overflow-y: auto;
        }

        #icon {
            width: 100%;
            display: block;
            margin-top: 10px;
        }

        #icon img {
            width: 30px;
            height: 30px;
            margin-left: 5px;
            border: 1px solid #DFDFDF;
        }

        #icon a {
            text-decoration: none;
        }
    </style>
</head>
<body style="margin: 0;">
<div class="ch-container">
    <div class="row">
        <ul class="nav nav-tabs" id="nav-menu" style="margin-top:5px;margin-bottom: 5px;">
            <li role="presentation" class="active"><a href="javascript:" th:id="nav0">个人信息</a></li>
            <!--<li role="presentation"><a href="javascript:" th:id="nav1" th:data-url="${oldCrmUrl}+'admin/orders_getKcOrdersListByStudent.action?kcOrders.personId='+${student.personId}+'&userToken='+${session.userToken}"
                                       onclick="navChangeIframe($(this))">订单管理</a></li>-->
            <li role="presentation"><a href="javascript:" th:id="nav1" th:data-url="'/order/list/'+${student.personId}+'?loginName='+${student.loginName}" onclick="navChangeIframe($(this))">订单管理</a></li>
            <!--<li role="presentation"><a href="javascript:" th:id="nav2" th:data-url="'/student/booked/course/'+${student.personId}+'?tokenString='+${student.tokenString}" onclick="navChangeIframe($(this))">预约课程</a></li>-->
            <!--<li role="presentation"><a href="javascript:" th:id="nav3" th:data-url="${oldCrmUrl}+'admin/lessons_getLessonsListByStudent.action?course.personId='+${student.personId}+'&userToken='+${session.userToken}"
                                       onclick="navChangeIframe($(this))">课程管理</a></li>-->
            <li role="presentation"><a href="javascript:" th:id="nav3" th:data-url="'/lesson/student/list/'+${student.personId}+'?loginName='+${student.loginName}+'&tokenString='+${student.tokenString}"
                                       onclick="navChangeIframe($(this))">课程管理</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav14" th:data-url="${oldCrmUrl}+'admin/person_EnterCashingPoints.action?person.id='+${student.personId}+'&userToken='+${session.userToken}"
                                       onclick="navChangeIframe($(this))">积分兑换</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav13" th:data-url="'https://da.etalk365.com/rpt_Booked_class_stu?crm_user_id='+${session.userid}+'&person_id='+${student.personId}+'&person_name='+${student.loginName}"
                                       onclick="navChangeIframe($(this))">月上课量趋势</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav4" th:data-url="${oldCrmUrl}+'admin/person_stuLessonComplain.action?person.id='+${student.personId}+'&userToken='+${session.userToken}" onclick="navChangeIframe($(this))">学员投诉</a>
            </li>
            <li role="presentation"><a href="javascript:" th:id="nav5" th:data-url="'/teacher/complaint/list/'+${student.personId}+'?loginName='+${student.loginName}" onclick="navChangeIframe($(this))">老师投诉</a>
            </li>
            <!--<li role="presentation"><a href="javascript:" th:id="nav5" th:data-url="'/student/emsg/record/'+${student.personId}" onclick="navChangeIframe($(this))">小E信息</a></li>-->
            <li role="presentation"><a href="javascript:" th:id="nav6" th:data-url="${oldCrmUrl}+'admin/person_enterStudentReports.action?tokenString='+${student.tokenString}+'&userToken='+${session.userToken}"
                                       onclick="navChangeIframe($(this))">学习月报</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav14" th:data-url="'/student/report/show/'+${student.personId}+'?tokenString='+${student.tokenString}" onclick="navChangeIframe($(this))">学习报表</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav7" th:data-url="${oldCrmUrl}+'admin/stuqrcode.jsp?loginName='+${student.loginName}+'&storesId='+${student.storesId}" onclick="navChangeIframe($(this))">专属二维码</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav8" th:data-url="'/student/change/record/list/page/'+${student.personId}" onclick="navChangeIframe($(this))">操作记录</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav9" th:data-url="'/student/info/edit?personId='+${student.personId}" onclick="navChangeIframe($(this))">学员信息编辑</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav10" th:data-url="'/student/info/toStuPreferences?personId='+${student.personId}" onclick="navChangeIframe($(this))">学员偏好设置</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav11" th:data-url="'/stuDynamic/dynamic?personId='+${student.personId}+'&sscCheck='+${sscCheck==null?'':sscCheck}" onclick="navChangeIframe($(this))">学员动态</a></li>
            <li role="presentation"><a href="javascript:" th:id="nav12" th:data-url="'/testPaper/page/personDoneResult?personId='+${student.personId}" onclick="navChangeIframe($(this))">阶段练习</a></li>
            <li role="presentation" th:if="${session.menuMap[336] != null}"><a href="javascript:" th:id="nav15" th:data-url="'http://hnet.etalk365.com/student/#/etalkpc/etuserinfo?languageType=en&t='+${student.tokenString}+'&pid='+${student.personId}" onclick="navChangeIframe($(this))">ET学员信息</a></li>
            <li style="padding-top: 11px;font-weight: bold" th:text="'学员：'+${student.loginName}"></li>
        </ul>
        <div style="padding:2px;width: 99.5%;display:table;" id="information">
            <div class="box-left">
                <div>
                    <ul>
                        <li style="border-bottom: none;">
                            <div style="text-align: center;width: 220px;" th:with="isScheme=${student.pictures!=null &&( #strings.startsWith(student.pictures,'http://') || #strings.startsWith(student.pictures,'https://'))}">
                                <img src="../../static/img/head/default.jpg" th:if="${!isScheme}" th:src="@{'//hnres.etalk365.com/'+${student.pictures}}" class="img-thumbnail" width="80" alt="学员图像" onerror="this.src='../../static/img/head/default.jpg'">
                                <img src="../../static/img/head/default.jpg" th:if="${isScheme}" th:src="@{${student.pictures}}" class="img-thumbnail" width="80" alt="学员图像" onerror="this.src='../../static/img/head/default.jpg'">
                                <p class="text-center" th:switch="${student.sex}">
                                    <strong><span th:text="${student.cnName}"></span></strong>
                                    <i class="fa fa-male" style="color: blue;" th:case="1" th:title="男"></i>
                                    <i class="fa fa-female" style="color: palevioletred;" th:case="2" th:title="女"></i>
                                    <i class="fa fa-genderless" th:case="*" th:title="未知"></i>
                                </p>
                                <div id="icon" class="text-center">
                                    <a th:if="${student.bindingWeixin}">
                                        <img th:src="@{/static/img/icon/weixin_y.png}" class="img-circle" th:alt="已绑定微信" th:title="'已绑定微信'+${student.listWeixin.size()>0?student.listWeixin.size():''}">
                                    </a>
                                    <img th:src="@{/static/img/icon/weixin_n.png}" class="img-circle" th:alt="未绑定微信" th:title="未绑定微信" th:unless="${student.bindingWeixin}">

                                    <a th:if="${student.bindingApp}">
                                        <img th:src="@{/static/img/icon/mobile_y.png}" class="img-circle" th:alt="已绑定APP" th:title="${student.listApp.get(0).online==1?'APP在线':'APP不在线'}">
                                    </a>
                                    <a th:unless="${student.bindingApp}">
                                        <img th:src="@{/static/img/icon/mobile_n.png}" class="img-circle" th:alt="未绑定APP" th:title="未绑定APP">
                                    </a>

                                    <a href="javascript:" th:if="${student.phone!=''}" th:id="'dialing'+${student.personId}" rel="popover" th:data-phone="${student.phone}" th:data-personId="${student.personId}">
                                        <img th:src="@{/static/img/icon/telephone_y.png}" class="img-circle" th:alt="点击可拨打电话" th:title="点击可拨打电话">
                                    </a>
                                    <img th:src="@{/static/img/icon/telephone_n.png}" class="img-circle" th:alt="不能拨打电话" th:title="不能拨打电话" th:unless="${student.phone!=''}">

                                    <a href="javascript:" th:if="${student.phone!=''}" th:id="'sendsms'+${student.personId}" rel="popover" th:data-phone="${student.phone}" th:data-personId="${student.personId}" th:data-loginId="${session.userid}">
                                        <img th:src="@{/static/img/icon/message_y.png}" class="img-circle" th:alt="点击发送短信" th:title="点击发送短信">
                                    </a>
                                    <img th:src="@{/static/img/icon/message_n.png}" class="img-circle" th:alt="不能发短信" th:title="不能发短信" th:unless="${student.phone!=''}">

                                    <a href="javascript:" th:onclick="|viewEMsg(${student.personId})|">
                                        <img class="img-circle" th:src="@{/static/img/icon/e_n.png}" th:id="xiaoe" th:alt="小E图标" th:title="小E未开启">
                                    </a>
                                </div>
                            </div>

                        </li>
                        <li>
                            <div>学<span style="margin-left: 28px;"></span>号：</div>
                            <div th:text="${student.loginName}"></div>
                        </li>

                        <li>
                            <div>英<span style="margin-left: 7px;"></span>文<span style="margin-left: 7px;"></span>名：</div>
                            <div th:text="${student.enName}"></div>
                        </li>
                        <li>
                            <div>手机号码：</div>
                            <div th:text="${student.phone}"></div>
                        </li>
                        <li>
                            <div>常用老师：</div>
                            <div>
                                <a href="javascript:void(0)" th:onclick="|showTeacherInfo(${student.teacherId1})|" th:if="${student.teacherId1>0}" th:text="${student.teacherLogin1}"></a>&nbsp;
                                <a href="javascript:void(0)" th:onclick="|showTeacherInfo(${student.teacherId2})|" th:if="${student.teacherId2>0}" th:text="${student.teacherLogin2}"></a>&nbsp;
                                <a href="javascript:void(0)" th:onclick="|showTeacherInfo(${student.teacherId3})|" th:if="${student.teacherId3>0}" th:text="${student.teacherLogin3}"></a>
                            </div>
                        </li>
                        <li>
                            <div>约课顾问：</div>
                            <div th:text="${student.bccLogin}"></div>
                        </li>
                        <li>
                            <div>课程顾问：</div>
                            <div th:text="${student.ccLogin}"></div>
                        </li>
                        <li>
                            <div>学习顾问：</div>
                            <div th:text="${student.sscLogin}"></div>
                        </li>
                        <li>
                            <div>客户属性：</div>
                            <div th:if="${student.parentId != 9 && student.parentId != 12}" th:text="${student.revisitName==null?'潜在客户':student.revisitName}"></div>
                            <div th:if="${student.parentId == 9}" th:text="${'在读学员/'+student.revisitName}"></div>
                            <div th:if="${student.parentId == 12}">过期学员</div>
                        </li>
                        <li>
                            <div>推<span style="margin-left: 7px;"></span>荐<span style="margin-left: 7px;"></span>人：</div>
                            <div th:text="${student.qrCode}"></div>
                        </li>
                        <li>
                            <div>注册时间：</div>
                            <div th:text="${#dates.format(student.registerTime,'yyyy/M/d HH:m:s')}"></div>
                        </li>
                        <li>
                            <div>所属门店：</div>
                            <div th:text="${student.ownStore}"></div>
                        </li>
                        <li>
                            <div>年<span style="margin-left: 28px;"></span>级：</div>
                            <div th:text="${student.grade}"></div>
                        </li>
                        <li>
                            <div>学<span style="margin-left: 28px;"></span>校：</div>
                            <div th:text="${student.schoolName}"></div>
                        </li>
                        <li>
                            <div>决<span style="margin-left: 7px;"></span>策<span style="margin-left: 7px;"></span>人：</div>
                            <div th:text="${student.decisionMaker}"></div>
                        </li>
                        <li>
                            <div>约课时间：</div>
                            <div th:text="${#dates.format(student.releaseTime,'yyyy/MM/dd H:mm')}"></div>
                        </li>
                        <li>
                            <div>客户渠道：</div>
                            <div th:text="${student.channelName}"></div>
                        </li>
                        <li>
                            <div>收<span style="margin-left: 7px;"></span>集<span style="margin-left: 7px;"></span>点：</div>
                            <div th:text="${student.schoolName}"></div>
                        </li>
                        <li style="border-bottom: none;">
                            <div class="text-center" style="width: 180px;">
                                <button class="btn btn-success btn-sm" th:onclick="viewMoreInfo(this)">打开更多详情</button>
                            </div>
                        </li>
                        <li style="border-bottom: none;"></li>
                    </ul>
                </div>
            </div>
            <div class="box-right">
                <div>
                    <!--学员更多信息-->
                    <div id="moreInfo" class="table-responsive" style="display: none;">
                        <table style="width: 99%;margin-bottom:5px;" class="table table-bordered table-condensed">
                            <caption>学员更多信息</caption>
                            <tbody>
                            <tr>
                                <td width="100" class="text-center text-nowrap"><Strong>出生日期:</Strong></td>
                                <td width="30%" th:text="${student.birthday}"></td>
                                <td width="100" class="text-center text-nowrap"><Strong>联系<span style="margin-left: 6px;"></span>QQ:</Strong></td>
                                <td width="30%" th:text="${student.qq}"></td>
                                <td width="100" class="text-center text-nowrap"><Strong>用户类型:</Strong></td>
                                <td width="30%" th:switch="${student.testMark}">
                                    <span th:case="0">常规</span>
                                    <span th:case="1">测试</span>
                                    <span th:case="2">市场</span>
                                    <span th:case="3">员工</span>
                                    <span th:case="4">个人代理</span>
                                    <span th:case="5">学生代理</span>
                                    <span th:case="6">JP</span>
                                    <span th:case="7">市场组长</span>
                                </td>
                            </tr>
                            <!--<tr>
                                <td class="text-center"><Strong>学<span style="margin-left: 30px;"></span>校:</Strong></td>
                                <td th:text="${student.schoolName}"></td>
                                <td class="text-center"><Strong>学习成绩:</Strong></td>
                                <td th:text="${student.grades}"></td>
                                <td class="text-center"><Strong>决<span style="margin-left: 8px;"></span>策<span style="margin-left: 7px;"></span>人:</Strong></td>
                                <td th:text="${student.decisionMaker}"></td>
                            </tr>-->
                            <tr>
                                <td class="text-center"><Strong>活动名称:</Strong></td>
                                <td th:text="${student.promotionName}"></td>
                                <td class="text-center"><Strong>上课店铺:</Strong></td>
                                <td th:text="${student.classStore}"></td>
                                <td class="text-center"><Strong>到店上课:</Strong></td>
                                <td th:text="${student.intention==1?'是':'否'}"></td>
                            </tr>
                            <tr>
                                <td class="text-center"><Strong>联系地址:</Strong></td>
                                <td th:colspan="5" th:text="${student.address}"></td>
                            </tr>
                            <tr>
                                <td class="text-center"><Strong>学习困难:</Strong></td>
                                <td th:colspan="5" th:text="${student.learningDifficulty}"></td>
                            </tr>
                            <tr>
                                <td class="text-center"><Strong>家庭情况:</Strong></td>
                                <td th:colspan="5" th:text="${student.familyInfo}"></td>
                            </tr>
                            <tr>
                                <td class="text-center"><Strong>学员爱好:</Strong></td>
                                <td th:colspan="5" th:text="${student.hobby}"></td>
                            </tr>
                            <tr>
                                <td class="text-center"><Strong>备注信息:</Strong></td>
                                <td th:colspan="5" th:text="${student.remark}"></td>
                            </tr>

                            </tbody>
                        </table>
                    </div>
                    <!--小E信息-->
                    <div id="xiaoEInfo" style="display: none;padding-top: 15px;">
                        <table style="margin: 5px;width: 99%;vertical-align: middle;" class="table table-bordered table-condensed">
                            <!--<caption>其它信息</caption>-->
                            <thead>
                            <tr>
                                <th class="text-center">小E形象</th>
                                <th class="text-center">开启小E</th>
                                <th class="text-center">小E等级</th>
                                <th class="text-center">经验值</th>
                                <th class="text-center">历史星星数</th>
                                <th class="text-center">现有星星数</th>
                                <th class="text-center">本周星星数</th>
                                <th class="text-center">礼券数</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr class="content">
                                <td class="text-center" style="vertical-align: middle;">
                                    <a style="font-size:26px" href="https://shimo.im/docs/hVst8bDzamsIOEqk" target="_blank" title="打开小E使用手册图解">
                                        <img class="epicture" src="" width="100"/>
                                    </a>
                                </td>
                                <td class="isOpen text-center" style="vertical-align: middle;"></td>
                                <td class="level text-center" style="vertical-align: middle;"></td>
                                <td class="experience text-center" style="vertical-align: middle;"></td>
                                <td class="starNumHistory text-center" style="vertical-align: middle;"></td>
                                <td class="starNumNow text-center" style="vertical-align: middle;"></td>
                                <td class="starNumWeek text-center" style="vertical-align: middle;"></td>
                                <td class="ticket text-center" style="vertical-align: middle;"></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <!--订单信息-->
                    <div class="table-responsive">
                        <table th:id="order" class="table table-striped table-bordered table-hover table-condensed">
                            <caption>订单信息
                                <button class="btn btn-success btn-sm" style="margin-left: 15px;padding: 1px 5px;" th:onclick="|viewOrder(${student.personId})|">订单管理</button>&nbsp;
                            </caption>
                            <thead>
                            <tr>
                                <th class="text-center text-nowrap font-weight-bold">套餐名称</th>
                                <th class="text-center text-nowrap font-weight-bold">售价</th>
                                <th class="text-center text-nowrap font-weight-bold">总课时</th>
                                <th class="text-center text-nowrap font-weight-bold">已用课时</th>
                                <th class="text-center text-nowrap font-weight-bold">购买时间</th>
                                <th class="text-center text-nowrap font-weight-bold">生效时间</th>
                                <th class="text-center text-nowrap font-weight-bold">到期时间</th>
                                <th class="text-center text-nowrap font-weight-bold">状态</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr th:each="order:${orderList.list}"
                                th:style="'display:'+(${isHide} ? 'none' : '')" th:class="${isHide?'isHidden':''}"
                                th:with="isHide=${order.state==0 || order.state==3 || (order.state==4 && #dates.millisecond(order.buyTime)+30*60*60*24*1000<#dates.millisecond(#dates.createNow())) || order.state==-1 || order.state==-2 || order.state==-3}">
                                <td class="text-center">
                                    <span th:text="${order.packageName}"></span><br>
                                    <a href="javascript:" th:if="${order.materialId!=null}" th:onclick="openTextbookImg([[${order.materialId}]],[[${order.materialPage}]])" th:text="${order.txtBooksName}"></a>
                                    <span th:if="${order.materialId==null}">无</span>
                                </td>
                                <td class="text-center" th:text="${order.salePrice.stripTrailingZeros().toPlainString()}"></td>
                                <td class="text-center" th:text="${order.lessonCount+''+(order.currencyName)}"></td>
                                <td class="text-center" th:text="${order.strLearnedClass.stripTrailingZeros().toPlainString()}"></td>
                                <td class="text-center" th:text="${#dates.format(order.buyTime,'yyyy/MM/dd H:m:s')}"></td>
                                <td class="text-center" th:text="${#dates.format(order.startDate,'yyyy/MM/dd')}"></td>
                                <td class="text-center" th:text="${order.surplusValid}"></td>
                                <td class="text-center" th:switch="${order.state}">
                                    <span class="label-default label" th:case="0">已终止</span>
                                    <span class="label-success label" th:case="1">有效</span>
                                    <span class="label-danger label" th:case="2">已冻结</span>
                                    <span class="label-success label" th:case="3">审核未通过</span>
                                    <span class="label-danger label" th:case="4">未付款</span>
                                    <span class="label-warning label" th:case="5">待审核</span>
                                    <span class="label-danger label" th:case="-1">已过期</span>
                                    <span class="label-danger label" th:case="-2">已学完</span>
                                    <span class="label-danger label" th:case="-3">已学完</span>
                                </td>
                            </tr>

                            </tbody>
                            <tfoot>
                            <tr>
                                <td colspan="8" style="height:5px;text-align: center;cursor: pointer;padding:0px;"
                                    onclick="$('.isHidden').toggle();$(this).find('span').toggleClass('glyphicon-chevron-down');$(this).find('span').toggleClass('glyphicon-chevron-up');if($(this).attr('title')=='显示隐藏内容'){$(this).attr('title','隐藏内容')}else{$(this).attr('title','显示隐藏内容');}"
                                    title="显示隐藏内容">
                                    <span class="glyphicon glyphicon-chevron-down"></span>
                                </td>
                            </tr>
                            </tfoot>
                        </table>
                    </div>
                    <!--课程信息-->
                    <div>
                        <ul class="nav nav-tabs">
                            <li role="presentation" class="active"><a href="javascript:" onclick="$('.nav>li').removeClass('active');$(this).parent().addClass('active');$('#booked').show();$('#completed').hide();">已预约</a></li>
                            <li role="presentation"><a href="javascript:" onclick="$('.nav>li').removeClass('active');$(this).parent().addClass('active');$('#booked').hide();$('#completed').show();">已完成</a></li>
                            <li style="margin-left: 20px">
                                <div style="margin-top: 5px;">
                                    <button class="btn btn-success btn-sm" th:onclick="|viewCourse(${student.personId})|">课程管理</button>&nbsp;
                                    <button class="btn btn-success btn-sm" th:onclick="|viewBooking(${student.personId})|">预约课程</button>&nbsp;
                                    <button class="btn btn-info btn-sm" th:onclick="|viewScore()|">查看成绩变化</button>
                                </div>
                            </li>
                        </ul>
                        <table style="border-top: none;margin-bottom:5px;" id="booked" class="table table-striped table-bordered table-hover table-condensed">
                            <!--<caption>已约课程</caption>-->
                            <thead>
                            <tr>
                                <th class="text-center text-nowrap font-weight-bold">上课时间</th>
                                <th class="text-center text-nowrap font-weight-bold">上课老师</th>
                                <th class="text-center text-nowrap font-weight-bold">使用套餐</th>
                                <th class="text-center text-nowrap font-weight-bold">使用教材</th>
                                <th class="text-center text-nowrap font-weight-bold">消耗课时|币</th>
                                <th class="text-center text-nowrap font-weight-bold">课程状态</th>
                            </tr>
                            </thead>
                            <tbody>
                            </tbody>
                            <tfoot>
                            <tr>
                                <td colspan="6"></td>
                            </tr>
                            </tfoot>
                        </table>
                        <table style="border-top: none;display: none;margin-bottom:5px;" id="completed" class="table table-striped table-bordered table-hover table-condensed">
                            <!--<caption>已完成课程</caption>-->
                            <thead>
                            <tr>
                                <th class="text-center text-nowrap font-weight-bold">上课时间</th>
                                <th class="text-center text-nowrap font-weight-bold">上课老师</th>
                                <th class="text-center text-nowrap font-weight-bold">使用套餐</th>
                                <th class="text-center text-nowrap font-weight-bold">使用教材</th>
                                <th class="text-center text-nowrap font-weight-bold">消耗课时|币</th>
                                <th class="text-center text-nowrap font-weight-bold">课程状态</th>
                            </tr>
                            </thead>
                            <tbody>
                            </tbody>
                            <tfoot>
                            <tr>
                                <td colspan="6"></td>
                            </tr>
                            </tfoot>
                        </table>
                    </div>

                    <!--动态-->
                    <div style="height: 740px;">
                        <iframe id="dynamics" src="" scrolling="no" frameborder="no" style="border: none;width:100%;display: block;height:100%;"></iframe>
                    </div>
                </div>
            </div>
        </div>
        <div id="iframe" style="display: none;">
            <iframe src="" frameborder="no" scrolling="auto" style="border: none;width:100%;display: block;height:100%;"></iframe>
        </div>
    </div>
    <div id="layer-photos-demo" class="layer-photos-demo" style="display:none;">
        <img layer-src="http://localhost/images/mid_banner/etalk2.jpg" alt="图片名">
        <img layer-src="http://localhost/images/mid_banner/etalk2.jpg" alt="图片名">
    </div>
</div>
<div th:include="include/onload_js::onloadJSCustomEdit(~{::script})">
    <!--<script type="text/javascript" href="../../static/stickUp/stickUp.min.js" th:src="@{/static/stickUp/stickUp.min.js}"></script>-->
    <script type="text/javascript" src="../../static/js/callandsms.js" th:src="@{/static/js/callandsms.js}"></script>
    <script type="text/javascript" src="../../static/js/layerTeacherInfo.js" th:src="@{/static/js/layerTeacherInfo.js?v=20210414}" charset="utf-8"></script>
    <script type="text/javascript" src="../../static/js/publicUtils.js" th:src="@{/static/js/publicUtils.js}" charset="utf-8"></script>
    <script src="../../static/textbook/viewPage.js" th:src="@{/static/textbook/viewPage.js?v=20210530}"></script>
    <script>
        function viewMoreInfo(obj) {
            /*layer.open({
                type: 1 //Page层类型
                ,area: ['800px','400px']
                ,title: ''
                ,shade: 0.6 //遮罩透明度
                ,maxmin: false //允许全屏最小化
                ,anim: 4 //0-6的动画形式，-1不开启
                ,content: $('#moreInfo')
            });*/
            $('#moreInfo').toggle();
            let isHide = $('#moreInfo').css('display') == 'none';
            if (isHide) {
                $(obj).text("打开更多详情");
            } else {
                $(obj).text("关闭更多详情");
            }
        }

        function getBookedList(personId, pageNum) {
            $.post("/student/booked/list/" + personId + "/" + pageNum, {}, function (result) {
                if (null == result) {
                    $("#booked >tbody").html("<tr><td colspan='6'>暂无记录</td></tr>");
                    return;
                } else {
                    $("#booked >tbody").html("");
                }
                for (let i = 0; i < result.list.length; i++) {
                    let trData = result.list[i];
                    let trHtml = "<tr>";
                    trHtml += "<td class=\"text-center\">" + trData.classTime + "</td>";
                    trHtml += "<td class=\"text-center\"><a href=\"javascript:\" onclick=\"showTeacherInfo("+trData.teacherId+")\" >" + trData.teacherLogin + "</a></td>";
                    trHtml += "<td class=\"text-center\">" + trData.packageName + "</td>";
                    if (trData.materialId==null || trData.materialId==0){
                        trHtml += "<td class=\"text-center\">" + trData.materialName + "</td>";
                    }else {
                        trHtml += "<td class=\"text-center\"><a href='javascript:' onclick=\"openTextbookImg("+trData.materialId+",'"+trData.materialPage+"')\"> " + trData.materialName + "</a></td>";
                    }
                    trHtml += "<td class=\"text-center\">" + trData.payMoney + trData.currencyName + "</td>";
                    trHtml += "<td class=\"text-center\">待上课</td>";
                    trHtml += "</tr>";
                    $("#booked >tbody").append(trHtml);
                }
                let trHtml = "当前第" + result.pageNum + "/" + result.pages + "页，当页显示" + result.startRow + "~" + result.endRow + "/" + result.total + "条记录";
                trHtml += "<ul class=\"pager pager-sm\" style=\"float: right;margin: 0;\">";
                trHtml += "<li class=\"" + (result.isFirstPage ? 'disabled' : 'active') + "\">";
                trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getBookedList(" + personId + ",1)\">首页</a>";
                trHtml += "</li>";
                trHtml += "<li class=\"" + (result.hasPreviousPage ? 'active' : 'disabled') + "\">";
                trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getBookedList(" + personId + "," + result.prePage + ")\">上一页</a>";
                trHtml += "</li>";
                if (result.hasNextPage) {
                    trHtml += "<li class=\"active\">";
                    trHtml += "<a href=\"javascript:\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getBookedList(" + personId + "," + result.nextPage + ")\">下一页</a>";
                    trHtml += "</li>";
                } else {
                    trHtml += "<li class=\"disabled\">";
                    trHtml += "<a href=\"javascript:\" style='padding: 0px 10px;border-radius: 5px;'>下一页</a>";
                    trHtml += "</li>";
                }
                if (result.isLastPage) {
                    trHtml += "<li class=\"disabled\">";
                    trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;'>最后一页</a>";
                    trHtml += "</li>";
                } else {
                    trHtml += "<li class=\"active\">";
                    trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getBookedList(" + personId + "," + result.pages + ")\">最后一页</a>";
                    trHtml += "</li>";
                }
                trHtml += "</ul>";
                $("#booked >tfoot>tr>td").html(trHtml)
            }, "json");
        }

        function getCompletedList(personId, pageNum) {
            $.post("/student/completed/list/" + personId + "/" + pageNum, {}, function (result) {
                if (null == result) {
                    $("#completed >tbody").html("<tr><td colspan='6'>暂无记录</td></tr>");
                    return;
                } else {
                    $("#completed >tbody").html("");
                }
                let classStatus = "";
                for (let i = 0; i < result.list.length; i++) {
                    let trData = result.list[i];
                    let trHtml = "<tr>";
                    trHtml += "<td class=\"text-center\">" + trData.classTime + "</td>";
                    trHtml += "<td class=\"text-center\"><a href=\"javascript:\" onclick=\"showTeacherInfo("+trData.teacherId+")\" >" + trData.teacherLogin + "</a></td>";
                    trHtml += "<td class=\"text-center\">" + trData.packageName + "</td>";
                    if (trData.materialId==null || trData.materialId==0){
                        trHtml += "<td class=\"text-center\">" + trData.materialName + "</td>";
                    }else {
                        trHtml += "<td class=\"text-center\"><a href='javascript:' onclick=\"openTextbookImg("+trData.materialId+",'"+trData.materialPage+"')\"> " + trData.materialName + "</a></td>";
                    }

                    trHtml += "<td class=\"text-center\">" + trData.payMoney + trData.currencyName + "</td>";

                    switch (trData.state) {
                        case 1:
                            if (trData.isEnd == 1) {
                                classStatus = "课程已结束";
                            }
                            break;
                        case 2:
                            classStatus = "已完成上课";
                            if (trData.teaRankId > 0) {
                                classStatus = "老师已评";
                            }
                            break;
                        case 3:
                            classStatus = "学员旷课";
                            break;
                        case 4:
                            classStatus = "老师取消";
                            break;
                    }
                    if (trData.returnMoney == 1) {
                        classStatus += "(课时已返)"
                    }
                    trHtml += "<td class=\"text-center\">" + classStatus + "</td>";
                    trHtml += "</tr>";
                    $("#completed >tbody").append(trHtml);
                }
                let trHtml = "当前第" + result.pageNum + "/" + result.pages + "页，当页显示" + result.startRow + "~" + result.endRow + "/" + result.total + "条记录";
                trHtml += "<ul class=\"pager pager-sm\" style=\"float: right;margin: 0;\">";

                trHtml += "<li class=\"" + (result.isFirstPage ? 'disabled' : 'active') + "\">";
                trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getCompletedList(" + personId + ",1)\">首页</a>";
                trHtml += "</li>";
                trHtml += "<li class=\"" + (result.hasPreviousPage ? 'active' : 'disabled') + "\">";
                trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getCompletedList(" + personId + "," + result.prePage + ")\">上一页</a>";
                trHtml += "</li>";
                if (result.hasNextPage) {
                    trHtml += "<li class=\"active\">";
                    trHtml += "<a href=\"javascript:\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getCompletedList(" + personId + "," + result.nextPage + ")\">下一页</a>";
                    trHtml += "</li>";
                } else {
                    trHtml += "<li class=\"disabled\">";
                    trHtml += "<a href=\"javascript:\" style='padding: 0px 10px;border-radius: 5px;'>下一页</a>";
                    trHtml += "</li>";
                }
                if (result.isLastPage) {
                    trHtml += "<li class=\"disabled\">";
                    trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;'>最后一页</a>";
                    trHtml += "</li>";
                } else {
                    trHtml += "<li class=\"active\">";
                    trHtml += "<a href=\"javascript:void(0);\" style='padding: 0px 10px;border-radius: 5px;' onclick=\"getCompletedList(" + personId + "," + result.pages + ")\">最后一页</a>";
                    trHtml += "</li>";
                }
                trHtml += "</ul>";
                $("#completed >tfoot>tr>td").html(trHtml)
            }, "json");
        }

        function getOrderList(personId, pageNum) {

            $.post("/student/order/list/" + personId + "/" + pageNum, {}, function (result) {
                if (null == result) {
                    $("#order >tbody").html("<tr><td colspan='8'>暂无记录</td></tr>");
                    return;
                } else {
                    $("#order >tbody").html("");
                }
                let classStatus = "";
                for (let i = 0; i < result.list.length; i++) {
                    let trData = result.list[i];
                    let timestamp = Date.parse(new Date());
                    let isHide = (trData.state == 0 || trData.state == 3 || trData.state == -1 || trData.state == -2 || trData.state == -3 || (trData.state == 4 && (trData.buyTime + 30 * 60 * 60 * 24 * 1000) < timestamp));
                    let trHtml = "<tr>";
                    if (isHide) {
                        trHtml = "<tr style='display: none;' class='isHidden'>"
                    }
                    if (trData.materialId==null || trData.materialId==0){
                        trHtml += "<td class=\"text-center\">" + trData.packageName + '<br>' + trData.txtBooksName + "</td>";
                    }else {
                        trHtml += "<td class=\"text-center\">" + trData.packageName + "<br><a href='javascript:' onclick=\"openTextbookImg("+trData.materialId+",'"+trData.materialPage+"')\"> " + trData.txtBooksName + "</a></td>";
                    }
                    trHtml += "<td class=\"text-center\">" + trData.salePrice + "</td>";
                    trHtml += "<td class=\"text-center\">" + trData.lessonCount + trData.currencyName + "</td>";
                    trHtml += "<td class=\"text-center\">" + trData.strLearnedClass + "</td>";
                    trHtml += "<td class=\"text-center\">" + formatDateTime(trData.buyTime) + "</td>";
                    trHtml += "<td class=\"text-center\">" + formatDate(trData.startDate) + "</td>";
                    trHtml += "<td class=\"text-center\">" + trData.surplusValid + "</td>";
                    switch (trData.state) {
                        case 0:
                            classStatus = "<span class=\"label-default label\">已终止</span>";
                            break;
                        case 1:
                            classStatus = "<span class=\"label-success label\">有效</span>";
                            break;
                        case 2:
                            classStatus = "<span class=\"label-danger label\">已冻结</span>";
                            break;
                        case 3:
                            classStatus = "<span class=\"label-success label\">审核未通过</span>";
                            break;
                        case 4:
                            classStatus = "<span class=\"label-danger label\">未付款</span>";
                            break;
                        case 5:
                            classStatus = "<span class=\"label-warning label\">待审核</span>";
                            break;
                        case -1:
                            classStatus = "<span class=\"label-danger label\">已过期</span>";
                            break;
                        case -2:
                            classStatus = "<span class=\"label-danger label\">已学完</span>";
                            break;
                        case -3:
                            classStatus = "<span class=\"label-danger label\">已学完</span>";
                            break;
                    }
                    if (trData.returnMoney == 1) {
                        classStatus += "(课时已返)"
                    }
                    trHtml += "<td class=\"text-center\">" + classStatus + "</td>";
                    trHtml += "</tr>";
                    $("#order >tbody").append(trHtml);
                }
                $("#order >tfoot").find('span').removeClass('glyphicon-chevron-up');
                $("#order >tfoot").find('span').addClass('glyphicon-chevron-down');
            }, "json");
        }

        function navChangeIframe(obj) {
            $("#nav-menu li").removeClass("active");
            $(obj).parent().addClass("active");
            $("#iframe>iframe").attr("src", $(obj).data('url'));
            $("#information").hide();
            $("#iframe").show();
        }

        /**
         * 获取小E信息
         * @param personId 学员id
         */
        function getEmsgStatus(personId) {
            let url = '[[${eMsgUrl}]]/backstage/interface/crm/master/' + personId;
            $.get(url, {}, function (result) {
                if (result.status === 1) {
                    if (result.data !== null) {
                        $('#xiaoe').attr('src', result.data.thumbnailImage);
                        $('#xiaoe').attr("title", '小E' + result.data.level.level + '级 (' + result.data.level.name + ')');

                        $('#xiaoEInfo table .epicture').attr('src', result.data.thumbnailImage);
                        $('#xiaoEInfo table .isOpen').text(result.data.status === 0 ? '已开启' : '未开启');
                        $('#xiaoEInfo table .level').text(result.data.level.level + '级(' + result.data.level.name + ')');
                        $('#xiaoEInfo table .experience').text(result.data.experience);
                        $('#xiaoEInfo table .starNumHistory').text(result.data.historyStar);
                        $('#xiaoEInfo table .starNumNow').text(result.data.weekStar);
                        $('#xiaoEInfo table .starNumWeek').text(result.data.rankStar == null ? 0 : result.data.rankStar);
                        $('#xiaoEInfo table .ticket').text(result.data.ticket);
                        return;
                    } else {
                        $('#xiaoEInfo table tbody tr').empty();
                        $('#xiaoEInfo table tbody tr').append("<td colspan='8'>没有小e信息哦~</td>");
                    }
                }

            }, "json")
        }

        //查询小E详情
        function viewEMsg(personId) {
            layer.open({
                type: 2 //Page层类型
                , area: ['90%', '750px']
                , title: ''
                , shade: 0.6 //遮罩透明度
                , maxmin: false //允许全屏最小化
                , anim: 1 //0-6的动画形式，-1不开启
                , content: '/student/emsg/record/' + personId
            });
        }

        //订单管理
        function viewOrder(personId) {
            // let url='[[${oldCrmUrl}]]admin/lessons_getLessonsListByStudent.action?userToken=[[${session.userToken}]]&course.personId=' + personId;
            let url='/order/list/'+personId+'?loginName=[[${student.loginName}]]&tokenString=[[${student.tokenString}]]';
            layer.open({
                type: 2 //Page层类型
                , area: ['95%', '95%']
                , title: ''
                , shade: 0.6 //遮罩透明度
                , maxmin: false //允许全屏最小化
                , anim: 1 //0-6的动画形式，-1不开启
                , content: url
                , cancel: function (index, layero) {
                    getOrderList(personId, 1);
                }
            });
        }

        //课程管理
        function viewCourse(personId) {
            // let url='[[${oldCrmUrl}]]admin/lessons_getLessonsListByStudent.action?userToken=[[${session.userToken}]]&course.personId=' + personId;
            let url='/lesson/student/list/'+personId+'?loginName=[[${student.loginName}]]&tokenString=[[${student.tokenString}]]';
            layer.open({
                type: 2 //Page层类型
                , area: ['95%', '95%']
                , title: ''
                , shade: 0.6 //遮罩透明度
                , maxmin: false //允许全屏最小化
                , anim: 1 //0-6的动画形式，-1不开启
                , content: url
                , cancel: function () {
                    //getBookedList(personId, 1);
                    window.location.reload(true);
                }
            });
        }

        //预约课程
        function viewBooking(personId) {
            layer.open({
                type: 2 //Page层类型
                , area: ['95%', '95%']
                , title: ''
                , shade: 0.6 //遮罩透明度
                , maxmin: false //允许全屏最小化
                , anim: 1 //0-6的动画形式，-1不开启
                , content: '/student/booked/course/' + personId + '?tokenString=[[${student.tokenString}]]'
                , cancel: function () {
                    //getBookedList(personId, 1);
                    window.location.reload(true);
                }
            });
        }

        //查看学员成绩变化
        function viewScore() {
            // let url = "https://da.etalk365.com/ss_score_collection?person_id=" + personId;
            let url="/student/grades/chart/[[${student.personId}]]"
            layer.open({
                type: 2 //Page层类型
                , area: ['80%', '95%']
                , title: ''
                , shade: 0.6 //遮罩透明度
                , maxmin: false //允许全屏最小化
                , anim: 1 //0-6的动画形式，-1不开启
                ,btnAlign: 'c'
                , content: url
                ,btn: ['录入成绩']
                ,yes:function(index){
                    addAchievement(index,url);
                    return false;
                }
            });
        }
        //layer  学员成绩相关信息 添加页面弹窗
        function addAchievement(layerIndex,parentUrl){
            let url = "/achievementCollectionManager/addAchievement?loginName=[[${student.loginName}]]";
            layer.open({
                type: 2,
                title: false,
                closeBtn: 1, //显示关闭按钮
                shade: [0],
                area: ['550px', '650px'], //宽高
                //offset: 'rb', //右下角弹出
                // time: 2000, //2秒后自动关闭
                anim: 2,
                content: [url, 'yes'], //iframe的url，no代表不显示滚动条
                end: function () { //此处用于演示
                    layer.iframeSrc(layerIndex, parentUrl);
                }
            });
        }
        //显示学员信息卡首页
        function showHome() {
            // 默认进入动态页面
            let personId = [[${student.personId}]];
            //加载动态页面
            //let dynamicsUrl="[[${oldCrmUrl}]]admin/person_enterStudentDynamics.action?newCrmLoad=0&person.id="+personId+"&userToken=[[${session.userToken}]]&sscCheck=[[${sscCheck}]]";
            let dynamicsUrl = "/stuDynamic/dynamic?personId=[[${student.personId}]]&&from=personInfo";
            let sscCheck = "[[${sscCheck}]]";
            let remindId = "[[${remindId}]]";
            if (sscCheck !== "") {
                dynamicsUrl += "&sscCheck=" + sscCheck;
            }
            if (remindId !== "") {
                dynamicsUrl += "&remindId=" + remindId;
            }
            $("#dynamics").attr("src", dynamicsUrl);
            //刷新动态页面
            /*$("#nav0").click(function () {
                alert(window.location.href);
                //window.location.reload(true);
            });*/
            //初始化小E信息
            getEmsgStatus(personId);
            //获取已约课程列表
            getBookedList(personId, 1);
            //获取已完成课程列表
            getCompletedList(personId, 1);
            //打电话
            $("#dialing" + personId).click(function () {
                dialingOut($(this).data("phone"), $(this).data("personid"));
            });
            //发短信
            $("#sendsms" + personId).click(function () {
                sendSms($(this).data("personid"), $(this).data("phone"), $(this).data("loginid"));
            });
        }
        //更改url参数值
        function replaceParamVal(url,paramName,replaceVal) {
            let oUrl = url.toString();
            let re=eval('/('+ paramName+'=)([^&]*)/gi');
            return oUrl.replace(re, paramName + '=' + replaceVal);
        }
        $(function () {
            $("#nav0").click(function () {
                let homeUrl=window.location;
                window.location=replaceParamVal(homeUrl,"tab",0);
                //window.location.reload(true);
            });

            let tab = [[${tab}]];
            if (tab == 9) {
                // 进入常用老师页面
                //console.log("进入常用老师页面");
                $("#nav10").click();
            }else {
                showHome();
            }
        })
    </script>
</div>
</body>
</html>
